import React, { useEffect } from 'react';
import { TouchableHighlight, StyleSheet } from 'react-native';
import { Flex, Toast } from '@ant-design/react-native';
import { useNavigation } from '@react-navigation/native';
import { LoadingContainer } from '@/rcomponents/Container';
import FlexTextField from '@/rcomponents/flexTextField';
import { IconX } from '@/rcomponents/iconx';
import UserStore from '@/stores/userStore';
import Card from './components/responsiveCard';
import ReleaseJobStore from './releaseJobStore';
import ScReleaseJobPage from './scReleaseJobPage';
import FlightReleaseJobPage from './flightReleaseJobPage';
import MaintainFilterHeader from './components/maintainFilterHeader';
import dayjs from 'dayjs';
//放行任务页

const styles = StyleSheet.create({
  released: { backgroundColor: '#d3d3d3' },
});

function ReleaseJobsTab() {
  const navigation = useNavigation();
  const rjStore = ReleaseJobStore.useStore();
  const userStore = UserStore.useStore();
  const { filterCond } = rjStore;
  useEffect(() => {
    handleListLoad({
      startDate: dayjs('1900-01-01'),
      endDate: dayjs().startOf('day'),
      selAirport: '',
      selAirplane: '',
      taskStatus: 99,
    });
    console.log('release job tab efffect');
  }, []);
  const handleListLoad = async (filter) => {
    const res = await rjStore.getJobList(
      userStore.user.LoginName,
      filter || filterCond,
    );
    if (res.errorCode) {
      //Toast.fail(res.errorMsg);
    }
  };
  const handleDetailNavigate = (item) => {
    //if (rjStore.getJobList.loading) {
    //  return;
    //}
    let detailPageRoute = FlightReleaseJobPage.routeName;
    if (item.taskPaperType === 'SC') {
      detailPageRoute = ScReleaseJobPage.routeName;
    }
    navigation.navigate(detailPageRoute, {
      taskStageTid: item.id,
      flightTid: item.flightTid,
      acno: item.airplane_no,
      airport: item.airport,
      taskPaperType: item.taskPaperType,
    });
  };
  return (
    <LoadingContainer
      loading={rjStore.getJobList.loading}
      onRefresh={handleListLoad}
      header={
        <MaintainFilterHeader
          filterCond={filterCond}
          onReload={handleListLoad}
        />
      }
      data={rjStore.list}
      renderItem={({ item }) => (
        <TouchableHighlight
          underlayColor="#CCC"
          activeOpacity={0.5}
          onPress={() => handleDetailNavigate(item)}
          key={item.id}
        >
          <Card style={item.taskStatus === '飞机已放行' ? styles.released : ''}>
            <Card.Header
              title={`${item.airplane_no}    级别： ${item.taskPaperType}`}
              extra={<IconX origin="ant" name="right" />}
            />
            <Card.Body>
              <Flex>
                <FlexTextField label="站点" fieldValue={item.airport} />
                <FlexTextField label="机位" fieldValue={item.bay} />
              </Flex>
              <Flex>
                <FlexTextField label="放行人员" fieldValue={item.passPer} />
                <FlexTextField label="任务数" fieldValue={item.taskCount} />
              </Flex>
              <Flex>
                <FlexTextField
                  label="完成状况"
                  fieldValue={item.finishPersent}
                />
                <FlexTextField label="状态" fieldValue={item.taskStatus} />
              </Flex>
              {item.taskPaperType !== 'SC' && (
                <Flex>
                  <FlexTextField label="前序航班" fieldValue={item.preflight} />
                </Flex>
              )}
              {item.taskPaperType !== 'SC' && (
                <Flex>
                  <FlexTextField
                    label="后序航班"
                    fieldValue={item.postflight}
                  />
                </Flex>
              )}
              <Flex>
                {item.taskPaperType === 'SC' && (
                  <FlexTextField
                    label="区域负责人"
                    fieldValue={item.areaOrWorker}
                  />
                )}
                {item.taskPaperType !== 'SC' && (
                  <FlexTextField
                    label="工作者"
                    fieldValue={item.areaOrWorker}
                    wrap="nowrap"
                  />
                )}
              </Flex>
            </Card.Body>
          </Card>
        </TouchableHighlight>
      )}
    />
  );
}

export default ReleaseJobsTab;
